<template>
  <div>
    <!-- 
      v-text、v-html指令
      作用: 动态设置标签内容
      语法：
      v-text="vue变量"
      v-html="vue变量"

      区别：
        v-text: 不能解析标签
        v-html: 可以解析标签

        指令的优先级高于插值表达式（两者同时使用指令会覆盖插值表达式的内容）
     -->
    <p v-text="str">{{ msg }}</p>
    <p v-html="str"></p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      str: "<span>我是一个span标签</span>，6666",
      msg: "888",
    };
  },
};
</script>

<style>
</style>